<template>
  <div>
    <Camera
      title="人脸信息录入"
      :visible.sync="overrideVisible"
      :items="items"
      :empty-items-error-msg="emptyItemsErrorMsg"
      :header-mappings="headerMappings"
      :canvas-width="600"
      :canvas-height="400"
      open-camera-btn-name="开始录入人脸"
      take-photo-btn-name="确定"
      photo-name="faceImage"
      :upload-options-gen="genAddFaceOptions"
      :upload-photo-api="uploadPhoto"
      @onTakePhotoSuccess="onTakePhotoSuccess"/>
  </div>
</template>

<script>
import Camera from "../Camera";
import {addFaceInfo} from "@/api/basedata/bstudent";

export default {
  name: "FaceRecord",
  components: {Camera},
  props:{
    visible: Boolean,
    items: Array,
    uploadPhotoApi: Function,
    emptyItemsErrorMsg: {
      type: String,
      default: "人员信息不能为空"
    },
    headerMappings: {
      type: Object,
      default: () => {
        return {
          "id": "学生编号",
          "name": "学生姓名",
          "className": "班级名称"
        };
      },
    },
  },
  data(){
    return{
      overrideVisible: this.visible,
      recordFacePerson: [],
    }
  },
  watch:{
    visible(val){
      this.overrideVisible = val;
    },
    overrideVisible(val){
      this.$emit("update:visible",val);
    }
  },
  methods: {
    uploadPhoto(formData){
      let method = this.uploadPhotoApi? this.uploadPhotoApi : addFaceInfo;
      return method(formData);
    },
    onTakePhotoSuccess(imageFile,base64Image){
      this.$emit("onTakePhotoSuccess",imageFile,base64Image);
    },
    genAddFaceOptions(imageFile, items){
      let formData = new FormData();
      formData.append("studentFaceInfo",JSON.stringify(items))
      formData.append("faceImgPath", imageFile);
      return formData;
    },
  }
}
</script>
